<div class="modal-header">
  <h3 class="modal-title">{{ modalTitle }}</h3>
</div>
<div class="modal-body modal-overflow">
  <div class="row">
    <br>
    <form>
      <div class="form-group col-xs-3">
        <label class="control-label">ID</label>
        <input class="form-control" type="text" placeholder="Id" pattern="[0-9]{1,}" title="Please enter an Id!" ng-model="param.id">
      </div>
      <div class="form-group col-xs-6">
        <label class="control-label">Name</label>
        <input class="form-control" type="text" placeholder="Name" ng-model="param.name">
      </div>
      <div class="col-xs-3">
        <button type="submit" class="btn btn-primary" ng-click="search(param.id, param.name)" style="margin-top: 25px">Search</button>
      </div>
    </form>
  </div>
  <br>
  <table class="table table-striped table-condensed">
    <thead>
      <th class="text-center">ID</th>
      <th class="text-center">Name</th>
    </thead>
    <tbody>
      <tr ng-repeat="data in data | orderBy:data[ID]" ng-click="selectModalRow($index)" ng-class="{'tr-selected': $index == selectedRow}">
        <td>{{ data[ID] }}</td>
        <td>{{ data[Value] }}</td>
      </tr>
    </tbody>
  </table>

</div>
<div class="modal-footer">
  <button class="btn btn-primary" ng-click="modalOk()">OK</button>
  <button class="btn btn-danger" ng-click="modalCancel()">Cancel</button>
</div>
